<template>
    <div class="page has-navbar searchcity">
        <von-header v-if="!show">
            <button class="button button-icon ion-ios-arrow-back" slot="left" @click="$router.go(-1)"></button>
            <span slot="title" class="dest">产品列表</span>
        </von-header>
        <von-header v-if="show">
            <button class="button button-icon ion-ios-arrow-back" slot="left" @click="$router.go(-1)"></button>
            <span slot="title" class="dest">{{this.message.router_info.name}}</span>
        </von-header>
        <div class="page-content">
            <six-first :products_info="product_list" v-if="!errShow"></six-first>
            <div v-if="errShow" class="error-tishi">抱歉，暂时没有相关产品~</div>
        </div>
        <loading v-if="!show"></loading>
    </div>
</template>
<script>
    import SixFirst from '../components/sixfirst.vue'
    import Loading from '../components/loading.vue'
    export default{
        components:{SixFirst,Loading},
        data(){
            return{
                cityId:this.$route.params.cityId,
                message:{},
                product_list:[],
                show:false,
                errShow:false
            }
        },
        created(){
            console.log(this.cityId)
            this.axios.get('https://app.toursforfun.com/search/'+this.cityId+'/product_list?page=1&page_size=10&type=all')
                .then(data=>{
                      this.show=true
                    this.message=data.data.data
                    console.log(this.message)
                    this.product_list=this.message.product_list
                    if(this.product_list.length){
                        this.errShow=false
                    }else{
                        this.errShow=true
                    }
//                    console.log(this.message)
                })
                .catch(err=>{
                    console.log(err)
                })
        }
    }
</script>
<style>
    .searchcity .bar.bar-header{
        box-shadow: none;
    }
    .searchcity .button.button-icon.ion-ios-arrow-back{
        color: #363636;
    }
    .searchcity .bar.bar-light .title {
        color: #363636;
        font-weight: 400;
        font-size:20px;
    }
    .error-tishi{
        width:100%;
        text-align: center;
        color: #6c6c6c;
    }
</style>